html,
body {
  display: flex;
  background: url('../img/background.png') no-repeat;
  background-size: cover;
  flex-direction: column;
}

/* 导航 */
.nav {
  flex: 0 0 100px;
}

/* 内容 */
.container {
  flex: 1;
  width: 800px;
  margin: 0 auto;
  display: flex;
  align-items: center;
}

.container .phone {
  width: 280px;
  height: 560px;
  background: url('../img/phone.png') no-repeat;
  background-size: cover;
}

.container .content {
  margin-left: 64px;
  color: #fff;
}

.container .content .title {
  display: flex;
  align-items: center;
}

.container .content .title img {
  width: 220px;
}

.container .content .subheading {
  font-size: 38px;
  font-weight: bold;
}

.container .content .tips {
  margin: 10px 0;
  font-size: 16px;
  font-style: italic;
}

.container .content .download {
  display: flex;
  height: 130px;
}

.container .content .download p {
  font-size: 16px;
  width: 130px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background-color: #fff;
  border-radius: 17.5px;
  margin: 10px;
  color: #333;
  cursor: pointer;
  height: 35px;
}

.container .content .download p>img {
  display: none;
  margin-bottom: 16px;
  width: 90px;
  height: 90px;
}

.container .content .download p span {
  margin-left: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 35px;
  width: 100px;
  position: relative;
}

.container .content .download p span img {
  width: 20px;
  height: 20px;
  position: absolute;
  left: -5px;
  padding-bottom: 2px;
}

/* 版权 */
.footer {
  flex: 0 0 100px;
}